<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>校园原创</title>
    <link rel="stylesheet" href="layui/css/layui.css">
    <link rel="icon" href="img/title.ico" type="img/x-ico" />
    <link rel="stylesheet" href="css/jquery.zySlide.css">
    <link rel="stylesheet" href="css/novelmain.css">
</head>

<body>
	<!--导航栏  -->
	<%@ include file="novelhead.jsp" %>
    <div class="layui-container">
        <!--头部查询区域-->
        <div class="layui-row">
            <div class="layui-col-md3 box"><img src="img/logo.png"></div>
            <div class="layui-col-md6 box">
                <form class="layui-form" action="serachcondition.action">
                    <div class="layui-form-item">
                        <input class="searchbox" name="serachtext" type="text" placeholder="作者/书籍">
                        <span><button class="searchbtn" lay-submit lay-filter="formDemo">搜索</button></span>
                    </div>
                </form>
            </div>
            <div class="layui-col-md3"> 
               	<c:if test="${loginuser==null || (loginuser!=null && loginuser.usertype!=2)}">
               		<div class="guide">
                   		<c:if test="${loginuser==null}">
                   			<a href="login.jsp"><img src="img/xiezuo.ico">我要当作家</a>
                   		</c:if>
                   		<c:if test="${loginuser!=null}">
                   			<a href="addauthoruser.jsp"><img src="img/xiezuo.ico">我要当作家</a>
                   		</c:if>
                   	</div>
                </c:if>
                <c:if test="${loginuser!=null && loginuser.usertype==2}">
		            <div class="guide">
		                 <a href="createnovel.jsp"><img src="img/xiezuo.ico">我要去写作</a>
		            </div>
                </c:if>
            </div>
        </div>
        <!--图片-->
        <div class="layui-row" style="margin-top:2%">
            <div class="layui-col-md12">
                <img src="img/headertop.jpg" style="width:100%">
            </div>
        </div>
        <hr style="height: 3px;">
        <!--分类及轮播区域-->
        <div class="layui-row">
            <!--分类-->
            <div class="layui-col-md2">
                <div style="margin-bottom:5px;text-align: center">
                    <strong class="underline">作品分类</strong>
                </div>
                <table class="table1" style="margin: auto">
                    <tr>
                        <td><a href="serachtype.action?noveltype=1">玄幻</a></td>
                        <td>
                            <a href="serachtype.action?noveltype=2">仙侠</a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="serachtype.action?noveltype=3">奇幻</a>
                        </td>
                        <td>
                            <a href="serachtype.action?noveltype=4">武侠</a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="serachtype.action?noveltype=5">都市</a>
                        </td>
                        <td>
                            <a href="serachtype.action?noveltype=6">历史</a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="serachtype.action?noveltype=7">军事</a>
                        </td>
                        <td>
                            <a href="serachtype.action?noveltype=8">科幻</a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="serachtype.action?noveltype=9">灵异</a>
                        </td>
                        <td>
                            <a href="serachtype.action?noveltype=10">体育</a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <a href="serachtype.action?noveltype=11">言情</a>
                        </td>
                        <td>
                            <a href="serachtype.action?noveltype=12">穿越</a>
                        </td>
                    </tr>
                </table>
            </div>
            <!--轮播-->
            <div class="layui-col-md10 layui-col-xs10">
                <div style="margin-bottom:5px;text-align: center"><strong class="underline">热门推荐</strong></div>
                <div id="Slide1" class="zy-Slide">
                    <!--prev:元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。-->
                    <section><</section>
                    <section>></section>
                    <ul>
                        <!--alt + shift : 可以创建一个矩形选择区域-->
                        <c:forEach items="${hotlist }" var="obj" begin="0" end="6" step="1">
	                        <li>
	                            <a href="novel.action?novelid=${obj.novelid}"><img src="../upload/${obj.photourl}" /></a>
	                        </li>
                        </c:forEach>
                    </ul>
                </div>
            </div>
        </div>
        <hr style="height: 3px;">
        <div class="layui-row layui-col-space10">
            <!--封面推荐区域-->
            <div class=" layui-col-md9">
                <div style="margin-bottom:5px "><strong class="underline"
                        style="margin-left: 6%;margin-top: 10px;">封面推荐</strong>
                </div><br>
                <div class="layui-row" style="border:solid 1px #dddddd">
                    <!--弹性盒子-->
                    <c:forEach items="${tiketnovel}" begin="0" end="7" var="tobj">
		                <div class="boxnovel" title="${tobj.novelname}">
		                    <div class="novelimg">
		                        <a href="novel.action?novelid=${tobj.novelid}"><img src="../upload/${tobj.photourl}" id="bookimg"></a>
		                    </div>
		                    <div class="novelname"><a href="novel.action?novelid=${tobj.novelid}">${tobj.novelname}</a></div>
		                    <div class="novelauthor"><a href="authormain.action?userid=${tobj.userid}" style="color:gray">${tobj.nickname}</a></div>
		                </div>
                	</c:forEach>
                    
                </div>
            </div>
            <!--人气作者排行-->
            <div class="layui-col-md3">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <strong class="underline" style="margin-left:-160px;margin-top: 10px;">人气作家排行</strong>
                    </div>
                    <div class="layui-card-body" style="border:solid 1px #dddddd">
	                    <c:forEach items="${authorwas}" begin="0" end="0" var="authorwas">
	                        <li>
	                            <div class="layui-row">
	                                <div class="layui-col-md6 layui-col-xs-offset1" style="text-align: left;">
	                                    <h3><b class="layui-bg-red">No.1</b></h3>
	                                    <a href="authormain.action?userid=${authorwas.userid}"><h3><b>${authorwas.nickname}</b></h3></a>
	                                    <h4><b style="color: red">人气最高</b></h4>
	                                    <h4><b style="color: green">${authorwas.ticketcont}票</b></h4>
	                                </div>
	                                <div class="layui-col-md5">
	                                    <img src="../upload/${authorwas.photourl}" style="width: 70%; height:90px">
	                                </div>
	                            </div>
	                        </li>
                        </c:forEach>
                        <!-- 撑开列表 -->
                        <div style="height:15px"></div>
                        <c:forEach items="${authorwas}" begin="1" end="9" var="authorwas" varStatus="status">
	                        <hr>
	                        <li>
	                            <div class="layui-row">
	                                <div class="layui-col-md1 layui-col-xs-offset1">
	                                    <h3 class="layui-bg-green"><b>${status.index + 1}</b></h3>
	                                </div>
	                                <div class="layui-col-md10">
	                                	<a href="authormain.action?userid=${authorwas.userid}">
	                                		<b style="text-align: left;"> ${authorwas.nickname}</b>
	                                	</a>
	                                    <span style="float: right;">${authorwas.ticketcont}票</span>
	                                </div>
	                            </div>
	                        </li>
                        </c:forEach>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row layui-col-space10">
            <!--新书推荐区域-->
            <div class=" layui-col-md9">
                <div style="margin-bottom:5px "><strong class="underline"
                        style="margin-left: 6%;margin-top: 10px;">新书推荐</strong>
                </div><br>
                <div class="layui-row" style="border:solid 1px #dddddd">
                    
                    <!--弹性盒子-->
                    <c:forEach items="${newnovel}"  begin="0" end="7" var="newnovel"  >
		                <div class="boxnovel" title="${newnovel.novelname}">
		                    <div class="novelimg">
		                        <a href="novel.action?novelid=${newnovel.novelid}"><img src="../upload/${newnovel.photourl}" id="bookimg"></a>
		                    </div>
		                    <div class="novelname"><a href="novel.action?novelid=${newnovel.novelid}">${newnovel.novelname}</a></div>
		                    <div class="novelauthor"><a href="authormain.action?userid=${newnovel.userid}" style="color:gray">${newnovel.nickname}</a></div>
		                </div>
                	</c:forEach>
                </div>
            </div>
            <!--人气小说排行-->
            <div class="layui-col-md3">
                <div class="layui-card">
                    <div class="layui-card-header">
                        <strong class="underline" style="margin-left:-160px;margin-top: 10px;">人气小说排行</strong>
                    </div>
                    <div class="layui-card-body" style="border:solid 1px #dddddd">
	                    <c:forEach items="${tiketnovel}" begin="0" end="0" var="tobj">
	                        <li>
	                            <div class="layui-row">
	                                <div class="layui-col-md6 layui-col-xs-offset1" style="text-align: left;">
	                                    <h3><b class="layui-bg-red">No.1</b></h3>
	                                    <a href="novel.action?novelid=${tobj.novelid }"><h3><b>${tobj.novelname }</b></h3></a>                      
	                                    <h4><b style="color: red">人气最高</b></h4>
	                                    <h4><b style="color:green">${tobj.ticketcont }票</b></h4>
	                                </div>
	                                <div class="layui-col-md5">
	                                    <img src="../upload/${tobj.photourl }" style="width: 70%; height:90px">
	                                </div>
	                            </div>
	                        </li>
                        </c:forEach>
                        <!-- 撑开列表 -->
                    	<div style="height:15px"></div>
                        <c:forEach items="${tiketnovel}" begin="1" end="9" var="tobj" varStatus="status">
	                        <hr>
	                        <li>
	                            <div class="layui-row">
	                                <div class="layui-col-md1 layui-col-xs-offset1">
	                                    <h3 class="layui-bg-green"><b>${status.index + 1}</b></h3>
	                                </div>
	                                <div class="layui-col-md10">
	                                    <a href="novel.action?novelid=${tobj.novelid }"><b style="text-align: left;">${tobj.novelname }</b></a>
	                                    <span style="float: right;">${tobj.ticketcont }票</span>
	                                </div>
	                            </div>
	                        </li> 
                        </c:forEach>             
                    </div>
                </div>
            </div>
        </div>
        
        <!--最近更新-->
        <div class="layui-row" style="margin-top:3%">
            <div style="margin-bottom:5px "><strong class="underline" style="margin-left: 6%;margin-top: 10px;">最近更新</strong></div>
            <div class="layui-row">
                <div class="layui-md12">
                    <table style="width:110%;margin-left:auto;text-align: left">
                    <c:forEach items="${recentlist}" var="obj">
                        <tr>
                            <td><a href="">[${obj.typename}]</a></td>
                            <td><a href="novel.action?novelid=${obj.novelid}">《${obj.novelname}》</a></td>
                            <td><a href="novelchap.action?chapterid=${obj.chapterid}">${obj.chaptername}</a></td>
                            <td><a href="authormain.action?userid=${obj.userid}">${obj.nickname}</a></td>
                            <td>${obj.createtime}</td>
                        </tr>
    				</c:forEach>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <!-- 脚部文件 -->
	<%@ include file="foot.jsp"%>
</body>
<script src="layui/layui.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.zySlide.js"></script>
<script src="js/index.js"></script>

</html>